<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
		    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
		    <link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.19.1/dist/bootstrap-table.min.css">
		  
		<title></title>
	</head>
	<body>
		<table id="table"></table>
		<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>
		    <!-- <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script> -->
		    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
		    <script src="https://unpkg.com/bootstrap-table@1.19.1/dist/bootstrap-table.min.js"></script>
		  <script type="text/javascript">
		  	$("#table").bootstrapTable({
					url:'./data1.json',
					pagination:true,
					sidePagination:'client',
					search:true,
					// data-ajax="ajaxRequest",
					columns:[{
						field:'id',
						title:'Item ID'
					},{
						field:'name',
						title:'Item Name'
					},{
						field:'price',
						title:'Item Price'
					}]
					
				});
				// your custom ajax request here
				  function ajaxRequest(params) {
				    var url = 'https://examples.wenzhixin.net.cn/examples/bootstrap_table/data'
				    $.get(url + '?' + $.param(params.data)).then(function (res) {
				      params.success(res)
				    })
				  }
		  </script>
	</body>
</html>
